<template>
  <div class="app-agent">
    <br>
    <el-form ref="queryForm" size="small" :inline="true" label-width="210px" v-model="queryParams" v-show="showSearch">
      <el-form-item label="手机号" prop="phone">
        <el-input placeholder="请输入手机号" v-model="queryParams.phone" />
      </el-form-item>

      <el-form-item label="地区" :label-width="formLabelWidth">
        <el-select v-model="selectProvince" placeholder="请选择省" style="width: 145px" @change="changeProvince" ref="selectProvince">
          <el-option v-for="item in provinces" size="small" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
        <el-select v-model="selectCity" placeholder="请选择市" style="width: 145px" @change="changeCity">
          <el-option v-for="item in cities" size="small" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
        <el-select v-model="selectArea" placeholder="请选择区" style="width: 145px" @change="changeArea">
          <el-option v-for="item in area" size="small" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="昵称" prop="nickName">
        <el-input placeholder="请输入昵称" v-model="queryParams.nickName" />
      </el-form-item>

      <el-form-item label="用户名" prop="userName">
        <el-input placeholder="请输入用户名" v-model="queryParams.userName" />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>

    </el-form>
    <!-- 新增 -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">创建身份</el-button>
      </el-col>
      <el-col :span="1.5">
        <!-- <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
        >批量上传</el-button> -->
        <el-upload ref="uploadAgent" class="upload-demo" :action="upUrl" name="file" :on-change="onChangeFile"
          :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :limit="2"
          :on-exceed="handleExceed" :on-success="hanldeSuccess" :headers="headers" :show-file-list="true"
          :auto-upload="true">
          <el-button type="warning" plain icon="el-icon-upload" size="mini" @click="handleImportMusic">批量上传</el-button>
        </el-upload>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['system:musicinfo:remove']">删除</el-button>
      </el-col> -->

      <!-- <el-col :span="1.5">
        <el-upload ref="uploadMusic" class="upload-demo" :action="upUrl" name="file" :on-change="onChangeFile"
          :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :limit="2"
          :on-exceed="handleExceed" :on-success="hanldeSuccess" :headers="headers" :show-file-list="true"
          :auto-upload="true">
          <el-button type="warning" plain icon="el-icon-upload" size="mini" @click="handleImportMusic"
            v-hasPermi="['system:musicinfo:importMusic']">批量上传</el-button>
        </el-upload>
      </el-col> -->
      <el-col :span="1.5"style="margin-left:10px">
             <el-button
               type="warning"
               plain
               icon="el-icon-download"
               size="mini"
               @click="handleExport"
             >导出
             </el-button>
           </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <!-- 表格 -->
    <el-table v-loading="loading" :data="AgentList" @selection-change="handleSelectionChange">
      <!-- <el-table-column type="selection" width="55" align="center" /> -->
      <!--      <el-table-column label="主键id" align="center" prop="id" />-->
      <!-- <el-table-column label="序号" align="center" prop="musicName" /> -->
      <el-table-column label="用户名" align="center" prop="name" />
      <el-table-column label="手机号" align="center" prop="phone" width="150" />
      <el-table-column label="后台身份" align="center" prop="backstage">
        <template slot-scope="scope">
          <span>{{ scope.row.backstage === 0 ? "无身份" : scope.row.backstage === 2 ? "代理" : null }}</span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="地区" align="center" prop="musicIndex" /> -->
      <el-table-column label="地区" align="center" width="200">
        <template slot-scope="scope">
          <span>{{ `${scope.row.provinceName}-${scope.row.cityName}-${scope.row.areaName}` }}</span>
          <!-- <span>{{  }}</span>
          <span>{{ scope.row.areaName }}</span> -->
        </template>
      </el-table-column>

      <el-table-column label="口令" align="center" prop="code" />
      <el-table-column label="昵称" align="center" prop="nickName" />
      <el-table-column label="绑定学生总数" align="center" prop="studentCount" width="100" />
      <el-table-column label="学生付费数" align="center" prop="studentPayCount" />
      <!-- <el-table-column label="绑定老师数" align="center" prop="musicIndex" /> -->
      <el-table-column label="学生付费总金额" align="center" prop="studentPay" width="100" />
      <el-table-column label="近一个月到期人数" align="center" prop="expireCount" width="100" />
      <!-- <el-table-column label="自己绑定学生数" align="center" prop="musicIndex" /> -->
      <!-- <el-table-column label="自己付费总金额" align="center" prop="musicIndex" /> -->
      <!-- <el-table-column label="近一个月到期人数" align="center" prop="count">
        <template slot-scope="scope">
          <span>{{ scope.row.count }}</span>
          <span>
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['system:musicinfo:edit']">查看明细</el-button>
          </span>
        </template>
      </el-table-column> -->

      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="150">
        <template slot-scope="scope">

          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>


          <el-button size="mini" type="text" icon="el-icon-info" @click="handleContentList(scope.row)">查看学生明细</el-button>

          <el-button size="mini" type="text" icon="el-icon-info" @click="handleContentList1(scope.row)">近一个月明细</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" /> -->

    <!-- <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
       /> -->
    <!-- 新增 -->
    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="800px" append-to-body>

      <el-form ref="arrayUserInfo" size="small" :inline="true" label-width="210px" v-model="arrayUserInfo" v-show="showSearch">
      <el-form-item label="手机号" prop="phone">
        <el-input placeholder="请输入手机号" v-model="arrayUserInfo.phone" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery1">查询</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery1">重置</el-button>
      </el-form-item>
    </el-form>


      <el-table v-loading="loading" :data="arrayUser" @selection-change="handleSelectionChanges">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="用户ID" align="center" prop="userId" />
        <el-table-column label="名称" align="center" prop="nickName">
        </el-table-column>
        <el-table-column label="手机号" align="center" prop="phone" width="150" />
      <el-table-column label="后台身份" align="center" prop="backstage">
        <template slot-scope="scope">
          <span>{{ scope.row.backstage === 0 ? "无身份" : scope.row.backstage === 2 ? "代理" : null }}</span>
        </template>
      </el-table-column>

      </el-table>
      <pagination v-show="total > 0" :total="total" :page.sync="arrayUserInfo.pageNum" :limit.sync="arrayUserInfo.pageSize" @pagination="userInfo"/>
      <el-divider></el-divider>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <!-- <el-form-item label="手机号" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入手机号" />
        </el-form-item> -->

        <el-form-item label="地区" :label-width="formLabelWidth">
          <el-select v-model="selectProvince" placeholder="请选择省" style="width: 145px" @change="changeProvince">
            <el-option v-for="item in provinces" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-select v-model="selectCity" placeholder="请选择市" style="width: 145px" @change="changeCity">
            <el-option v-for="item in cities" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-select v-model="selectArea" placeholder="请选择区" style="width: 145px" @change="changeArea">
            <el-option v-for="item in area" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="form.name" placeholder="请输入姓名" />
        </el-form-item>
        <!-- <el-form-item label="昵称" prop="nickName">
          <el-input v-model="form.nickName" placeholder="请输入昵称" />
        </el-form-item>  -->
        <el-form-item label="身份" prop="type">
          <el-select v-model="form.type" placeholder="请选择身份" clearable>
            <el-option label="无身份" :value="0"></el-option>
            <el-option label="代理" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="备注" prop="publisher">
          <el-input v-model="form.publisher" placeholder="请输入备注" />
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm2">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 修改弹窗 -->

    <el-dialog :title="title" :visible.sync="opens" width="500px" append-to-body>
      <el-form ref="forms" :model="forms" :rules="rules" label-width="80px">
        <el-form-item label="手机号" prop="phone">
          <el-input v-model="forms.phone" placeholder="请输入手机号" />
        </el-form-item>

        <el-form-item label="地区" :label-width="formLabelWidth">
          <el-select v-model="selectProvince" placeholder="请选择省" style="width: 120px" @change="changeProvince">
            <el-option v-for="item in provinces" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-select v-model="selectCity" placeholder="请选择市" style="width: 120px" @change="changeCity">
            <el-option v-for="item in cities" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-select v-model="selectArea" placeholder="请选择区" style="width: 120px" @change="changeArea">
            <el-option v-for="item in area" size="small" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="forms.name" placeholder="请输入姓名" />
        </el-form-item>
        <el-form-item label="昵称" prop="nickName">
          <el-input v-model="forms.nickName" placeholder="请输入昵称" />
        </el-form-item>
        <el-form-item label="解绑学生" prop="untie">
          <template slot-scope="scope">
            <el-input v-model="forms.untie" placeholder="请选择" style="width: 145px" />
            <span>
              <el-button @click="handleAdd1">解绑</el-button>
            </span>
          </template>
        </el-form-item>
        <el-form-item label="换绑学生" prop="stu">
          <template slot-scope="scope">
            <el-input v-model="forms.stu" placeholder="请选择" style="width: 145px" />
            <span>
              <el-button @click="handleAdd2">换绑</el-button>
            </span>
          </template>
        </el-form-item>
        <el-form-item label="代理人" prop="change">
          <template slot-scope="scope">
            <el-input v-model="forms.change" placeholder="请选择" style="width: 145px" />
            <span>
              <!-- <el-button>解绑</el-button> -->
              <el-button @click="handleAdd3">换绑</el-button>
            </span>
          </template>
        </el-form-item>
        <!-- <el-form-item label="备注" prop="publisher">
          <el-input v-model="form.publisher" placeholder="请输入备注" />
        </el-form-item>-->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 解绑弹窗 -->
    <el-dialog :title="title" :visible.sync="openOne" :close-on-click-modal="false" width="800px" append-to-body>
      <el-table v-loading="loading" :data="arrayList" @selection-change="handleSelectionChanges1">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="用户ID" align="center" prop="id" />
        <el-table-column label="名称" align="center" prop="nickName">
        </el-table-column>

      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm1">确 定</el-button>
        <el-button @click="cancel1">取 消</el-button>
      </div>
    </el-dialog>

     <!-- 换绑弹窗 -->
     <el-dialog :title="title" :visible.sync="openTwo" :close-on-click-modal="false" width="800px" append-to-body>
      <el-table v-loading="loading" :data="arrayLists" @selection-change="handleSelectionChanges2">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="用户ID" align="center" prop="id" />
        <el-table-column label="名称" align="center" prop="nickName">
        </el-table-column>

      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm1">确 定</el-button>
        <el-button @click="cancel1">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 代理人 -->
    <el-dialog :title="title" :visible.sync="openThree" :close-on-click-modal="false" width="800px" append-to-body>
      <el-table v-loading="loading" :data="arrayUser" @selection-change="handleSelectionChanges">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="用户ID" align="center" prop="userId" />
        <el-table-column label="名称" align="center" prop="nickName">
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm1">确 定</el-button>
        <el-button @click="cancel1">取 消</el-button>
      </div>
    </el-dialog>


    <!-- 查询明细时间 -->
    <el-dialog :title="title" :visible.sync="openes" width="500px" append-to-body>
      <el-form ref="forms" :model="formList" :rules="rules" label-width="80px">
        <el-form-item label="开始时间" prop="start">
          <el-date-picker
      v-model="formList.start"
      type="datetime"
      placeholder="开始日期">
    </el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间" prop="end">
          <el-date-picker
      v-model="formList.end"
      type="datetime"
      placeholder="结束时间">
    </el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm3">确 定</el-button>
        <el-button @click="cancel1">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { regionData } from "../../../../node_modules/element-china-area-data";
import { listAgent, addAgent, getVirtualUser, upAgent, delAgent, getUserList,getStuList,getMonthList } from "../../../api/system/agent";
export default {
  name: 'agent',
  data() {
    return {
      upUrl: process.env.VUE_APP_BASE_API + '/backstage/sys/add/excel',
      // id:null,
      // 遮罩层
      // loading: true,
      
      // 总条数
      total: 0,
      // 乐曲信息表格数据
      AgentList: [],
      // 是否显示弹出层
      open: false,
      opens: false,
      openOne: false,
      openTwo: false,
      openThree: false,
      openes:false,
      // 显示隐藏二级
      isFlag: false,

      form: {},
      forms: {
        id: null,
        untie: null,
        stu: null,
        change: null
      },
      //查询学生明细
      formList:{
        code:null,//口令
        name:null,//昵称
        start:null,//开始时间
        end:null//结束时间
      },
      // 显示搜索条件
      showSearch: true,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        phone: null,
        nickName: null,
        provinceId: null,
        cityId: null,
        areaId: null,
        userName: null,
        provinceName:null,
        cityName:null,
        areaName:null
      },
      provinces: regionData,
      cities: [],
      area: [],
      selectProvince: "",
      selectCity: "",
      selectArea: "",
      //普通用户
      arrayUser: {},
      arrayUserInfo: {
        pageNum: 1,
        pageSize: 10,
        phone:null
      },
      //解绑列表
      arrayUserList: {
        pageNum: 1,
        pageSize: 10,
        code: null
      },
      arrayList: {},
      arrayLists: {},
      userId: null
    }
  },
  created() {
    this.getList();
    // this.getInfo()

  },
  methods: {
// 查看学生明细
handleContentList(row){
  this.openes = true;
  this.formList.code = row.code;
  // this.formList.end=(this.formList.end).getTime();
 

  
      },
      submitForm3() {
        var date = new Date(this.formList.end);
        var dates = new Date(this.formList.start);
var timestamp = date.getTime(); // 将毫秒转换为秒
var timestamps = dates.getTime(); // 将毫秒转换为秒
if(timestamp == 0){
  timestamp = null
}
if(timestamps == 0){
  timestamps = null
}
  let code = this.formList.code
  let start = timestamps
  let end = timestamp
  // this.$router.push('/stuList/' + code + start + end);
  this.$router.push({ path: '/stuList/', query: { param1: code, param2: start, param3: end }});

  getStuList({code: code, start: start, end: end}).then(response=>{
        localStorage.setItem('stuList',JSON.stringify(response.data))
        localStorage.setItem('code',JSON.stringify(code))
        localStorage.setItem('start',JSON.stringify(start))
        localStorage.setItem('end',JSON.stringify(end))
      })
    },
      // 查看到期记录
handleContentList1(row){
  const userId = row.userId;
  this.$router.push("/monthList/" + userId);
  getMonthList({userId}).then(response=>{
        localStorage.setItem('monthList',JSON.stringify(response.data))
      })
      },
    /** 查询代理人列表 */
    getList() {
      this.loading = true;
      // this.total = 3;
      listAgent(this.queryParams).then(response => {
        this.AgentList = response.data;
        this.total = response.total;
        this.loading = false;
      });
    },


    userInfo() {
      this.loading = true;

      getVirtualUser(this.arrayUserInfo).then(res => {
        this.arrayUser = res.rows
        this.total = res.total
        this.loading = false;
      })
    },





    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    handleQuery1() {
      this.arrayUserInfo.pageNum = 1;
      this.userInfo()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.selectProvince = "",
      this.selectCity = "",
      this.selectArea = "",
      this.queryParams.provinceId = null,
      this.queryParams.cityId = null,
      this.queryParams.areaId = null,
      this.queryParams.provinceName = null,
      this.queryParams.cityName = null,
      this.queryParams.areaName = null,
      this.queryParams.nickName = null,
      this.queryParams.phone = null,
      this.queryParams.name = null,
      this.handleQuery();
     
      // listAgent(this.queryParams).then(response => {
      //   this.AgentList = response.data;
      //   this.total = response.total;
      //   this.loading = false;
      // });
    },
    resetQuery1(){
      this.resetForm("arrayUserInfo");
      this.arrayUserInfo.phone = null;
      this.handleQuery1()
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.opens = false;
     
      this.reset();
    },
    cancel1(){
      this.openOne = false;
      this.openTwo = false;
      this.openThree = false;
      this.openes = false;
    },
    // 表单重置
    reset() {
      this.form = {
        areaId: null,
        backstage: null,
        cityId: null,
        code: null,
        expireCount: null,
        name: null,
        nickName: null,
        phone: null,
        provinceId: null,
        studentCount: null,
        studentPay: null,
        studentPayCount: null,
        userId: null,
       provinceName:null,
        cityName:null,
        areaName:null

      };
      this.forms = {
        areaId: null,
        backstage: null,
        cityId: null,
        code: null,
        expireCount: null,
        name: null,
        nickName: null,
        phone: null,
        provinceId: null,
        studentCount: null,
        studentPay: null,
        studentPayCount: null,
        userId: null,
        untie: null,
        stu: null,
        change: null,
        id: null,
        provinceName:null,
        cityName:null,
        areaName:null
      };
      this.resetForm("form");
      this.resetForm("forms");
    },

    changeProvince() {
      // console.log(this.provinces)
      // console.log(this.selectProvince)
      this.cities = [];
      this.area = [];
      this.selectCity = "";
      this.selectArea = "";
      let cityItem = this.provinces.filter(
        (item) => {
          if(item.value === this.selectProvince){
            this.forms.provinceName = item.label;
            this.form.provinceName = item.label;
            this.queryParams.provinceName = item.label;
          }
          return item.value === this.selectProvince
        }
      );
      if (cityItem[0]) {
        this.cities = cityItem[0].children;
      };
      this.queryParams.provinceId = `${this.selectProvince}0000`
      this.form.provinceId = `${this.selectProvince}0000`
      this.forms.provinceId = `${this.selectProvince}0000`
      
    },
    changeCity() {
      // console.log("城市选择")
      // console.log(this.selectCity)
      this.area = [];
      this.selectArea = "";
      let areaItem = this.cities.filter(
        (item) =>{
          if(item.value === this.selectCity){
            this.forms.cityName = item.label;
            this.form.cityName = item.label;
            this.queryParams.cityName = item.label;
          }
          return item.value === this.selectCity
        }

      );
      if (areaItem[0]) {
        this.area = areaItem[0].children;
      };
      this.queryParams.cityId = `${this.selectCity}00`
      this.form.cityId = `${this.selectCity}00`
      this.forms.cityId = `${this.selectCity}00`
    },
    changeArea() {

      // console.log("地区选择")
      // console.log(this.selectArea)
       this.area.filter(
        (item) =>{
          if(item.value === this.selectArea){
            this.forms.areaName = item.label;
            this.form.areaName = item.label;
            this.queryParams.areaName = item.label;
          }
          return item.value === this.selectArea
        }
      );
      this.queryParams.areaId = `${this.selectArea}`
      this.form.areaId = `${this.selectArea}`
      this.forms.areaId = `${this.selectArea}`
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "创建身份";
      this.userInfo()
    },
    handleAdd1() {
      this.openOne = true;
      this.title = "解绑列表";
    },
    handleAdd2() {
      this.openTwo = true;
      this.title = "换绑列表";
    },
    handleAdd3() {
      this.openThree = true;
      this.title = "代理列表";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      this.userInfo()
      this.opens = true;
      this.forms.id = row.userId;
      this.forms.phone = row.phone
      this.forms.provinceId = row.provinceId
      this.forms.areaId = row.areaId
      this.forms.cityId = row.cityId
      this.forms.name = row.name
      this.forms.nickName = row.nickName;
      this.forms.code = row.code;
      this.arrayUserList.code = row.code;
      getUserList(this.arrayUserList).then(res => {
        this.arrayList = res.rows;
        // this.total = res.total;
        this.arrayLists = res.rows;
      })
    
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.userId)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },

    handleSelectionChanges(selection) {
      this.userId = selection.map(item => item.userId);
      this.userId.forEach(item => {
        this.form.userId = item
        this.forms.change = item
      })
    },
    handleSelectionChanges1(selection) {
     let id = selection.map(item => item.id);
      id.forEach(item => {
        this.forms.untie = item
      })

    },
    handleSelectionChanges2(selection) {
     let id = selection.map(item => item.id);
      id.forEach(item => {
        this.forms.stu = item
      })
    },
    
    submitForm1(){
      this.openOne = false
      this.openTwo = false
      this.openThree = false
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["forms"].validate(valid => {
      if (valid) {
      if (this.forms.id != null) {
        // let userName = this.forms.name
        upAgent({...this.forms,userName:this.forms.name}).then(response => {
          this.$modal.msgSuccess("修改成功");
          this.opens = false;
          this.getList();
        });
      }
        }
      }
      )
    },
    submitForm2() {
      this.$refs["form"].validate(valid => {
      if (valid){
        addAgent(this.form).then(response => {
          this.$modal.msgSuccess("新增成功");
          this.open = false;
          this.getList();
      })
      }})
    },

    /** 删除按钮操作 */
    handleDelete(row) {
      const code = row.code;
      this.$modal.confirm('是否确认删除').then(function () {
        return delAgent({code:code})
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch((err) => { 
      });
    },
     /** 导出按钮操作 */
     handleExport() {
      this.download('/backstage/sys/derive/agency',{}, `agent_${new Date().getTime()}.xlsx`)
    }
  },
}
</script>

<style scoped>
.on_border_input>>>.el-input__inner {
  border: 0px;
}

.on_border_select>>>.el-input__inner {
  border: 0px;
  /* color: blue; */
  font-size: 12px;
}
</style>